import React, { useRef, useState } from 'react';
import { useAccess, useModel } from 'umi';
import { DrawerForm, PageContainer, ProCard, ProForm, ProFormDatePicker, ProFormDateTimePicker, ProFormInstance, ProFormTextArea } from '@ant-design/pro-components';
import { Button, message } from 'antd';
import {
    CheckCircleOutlined,
    CheckCircleTwoTone,
    PlusOutlined,
    UserOutlined,
} from '@ant-design/icons';
import FormItem from 'antd/es/form/FormItem';
import UploadDragger from '../../components/UploadDragger';
interface AddReportProps {
    // record: InstructRecordData.PageVo;
    onClose: () => void;
}
import dayjs from 'dayjs';
const AddReport: React.FC<AddReportProps> = () => {
    const access = useAccess();
    const formRef = useRef<ProFormInstance>();
    const { initialState } = useModel('@@initialState');
    const { currentUser } = initialState || {};

    return <>
        <DrawerForm
            formRef={formRef}
            key={`drawer_form_detail_report`}
            title={'报送'}
            trigger={
                <Button
                    key="primary"
                    type="primary"

                >
                    报送
                </Button>
            }
            autoFocusFirstInput
            drawerProps={{
                size: 'large',
                forceRender: true,
                destroyOnClose: true,
            }}
            submitter={{
                submitButtonProps: {
                    style: {
                        display: 'none',
                    },
                },
                render: (props, defaultDoms) => {
                    return [
                        ...defaultDoms,
                        <Button
                            key="button_release_state_discard"
                            icon={<CheckCircleOutlined />}
                            type="primary"
                            style={{
                                background: '#87d068',
                            }}
                            onClick={() => {
                                const values = formRef.current?.getFieldsValue();
                                console.log(values);
                                if (
                                    values.content === undefined ||
                                    values.content.length === 0 ||
                                    values.content.trim() === ''
                                ) {
                                    message.warning('请输入报送内容');
                                    return;
                                }
                                
                                // const response = await saveCuesTopic({
                                //     ...values,
                                //     createdSource: 1,
                                //   });
                          
                                // if (values.publishTime === undefined) {
                                //     message.warning('请选择报送时间');
                                //     return;
                                // }
                                // if (response.code === 0) {
                                //     message.success('提交成功');
                                //     onRefurbish();
                                //     return true;
                                // } else {
                                //     return false;
                                // }
                            }}
                        >
                            提交
                        </Button>,
                    ];
                },
            }}
            onVisibleChange={(visible) => {
                // if (visible) {
                //     getSubmitDetails();
                // } else {
                //     onClose();
                // }
            }}
        >

            <ProFormTextArea
                name="content"
                label={
                    <>
                        <span
                            style={{
                                color: '#ff4d4f',
                                fontSize: 14,
                                paddingRight: 4,
                            }}
                        >
                            *
                        </span>
                        报送内容
                    </>
                }
                width="xl"
                fieldProps={{
                    allowClear: true,
                    rows: 3,
                    maxLength: 200,
                    required: true
                }}
            />
            <ProFormDatePicker
                width="xl"
                name="publishTime"
                label={
                    <>
                        <span
                            style={{
                                color: '#ff4d4f',
                                fontSize: 14,
                                paddingRight: 4,
                            }}
                        >
                            *
                        </span>
                        报送时间
                    </>
                }
                fieldProps={{
                    inputReadOnly: true,
                    ranges: {
                        后3天: [dayjs(), dayjs().add(3, 'days')],
                        后5天: [dayjs(), dayjs().add(5, 'days')],
                        后7天: [dayjs(), dayjs().add(7, 'days')],
                        后10天: [dayjs(), dayjs().add(10, 'days')],
                        后15天: [dayjs(), dayjs().add(15, 'days')],
                        后20天: [dayjs(), dayjs().add(20, 'days')],
                        后30天: [dayjs(), dayjs().add(30, 'days')],
                        后50天: [dayjs(), dayjs().add(50, 'days')],
                        后90天: [dayjs(), dayjs().add(90, 'days')],
                    },
                    format: 'YYYY-MM-DD HH:mm',
                }}
            />
            <FormItem
                name="articleAttachments"
                hidden={!access.主动报送x上报线索x附件}
                label={
                    <span
                        style={{
                            marginLeft: 11,
                        }}
                    >
                        附件
                    </span>
                }
            >
                <UploadDragger
                    onPreview={(file) => { }}
                    access={{
                        isPicture: access.主动报送x上报线索x附件x图片,
                        isVideo: access.主动报送x上报线索x附件x视频,
                        isOffice: access.主动报送x上报线索x附件x办公,
                        isOther: access.主动报送x上报线索x附件x其他,
                    }}
                    url="/cues/attachment/save"
                    mode="active"
                />
            </FormItem>
        </DrawerForm >
    </>;
};
export default AddReport;
